/*
 * @Author: luojie 
 * @Date: 2019-05-11 23:21:06 
 * @Last Modified by: luojie
 * @Last Modified time: 2021-05-09 21:21:08
 * 图表配置
 */
/**
 * 党组织情况统计
 */
export let option1 = {
    tooltip: {
        trigger: "axis",
        axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    color: ["#e83c34", "#539eaa", "#eea17d", "#84cfb6", "#f06807"],
    legend: {
        data: [],
        textStyle: {
            color: "#fff"
        }
    },
    grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
    },
    xAxis: {
        type: "category",
        splitLine: { show: false },
        axisLabel: {
            rotate: 45,
            color: "#fff"
        },
        axisLine: {
            show: false,
            lineStyle: {
                // color:"#fff"
            }
        },
        data: [
            "肥乡镇",
            "天台山镇",
            "辛安镇镇",
            "大寺上镇",
            "东漳堡镇",
            "毛演堡镇",
            "元固乡",
            "屯庄营镇",
            "旧店乡"
        ]
    },
    yAxis: {
        type: "value",
        axisLine: {
            show: false,
            lineStyle: {
                // color:"#fff"
            }
        },
        splitLine: { show: false },
        axisLabel: {
            color: "#fff"
        }
    },
    series: [

    ]
};
/**
 * 党员积分
 */
var optionDataStyle2 = {
    normal: {
        label: { show: false },
        labelLine: { show: false }
    },
};
var optionPlaceHolderStyle2 = {
    normal: {
        color: 'transparent',
        borderColor: "rgba(255,255,255,.3)",
        borderType: "dashed",
        label: { show: false },
        labelLine: { show: false }
    },
};
export let option2 = {
    title: {
        text: '党员积分情况',
        x: 'center',
        y: 190,
        textStyle: {
            color: '#00f4e7',
            fontSize: 12,
            fontWeight: 'bolder'
        }
    },
    tooltip: {
        show: false,
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    color: ["#fe2b32", "#d8cc2e", "#fa9125", "#21e8b4"],
    legend: {
        orient: 'vertical',
        // x : document.getElementById('stat2').offsetWidth / 2,
        itemGap: 12,
        textStyle: {
            color: "#fff"
        },
        data: ['90分至100分的人数占比的', '80分至90分的人数占比的', '70分至80分的人数占比的', '60分至70分的人数占比的']
    },
    series: [
        {
            name: '党员积分情况',
            type: 'pie',
            clockWise: false,
            hoverAnimation: false,
            radius: [83, 95],
            center: ['50%', '68%'],
            itemStyle: optionDataStyle2,
            data: [
                {
                    value: 0,
                    name: '90分至100分的人数占比的',
                },
                {
                    value: 100,
                    name: 'invisible',
                    itemStyle: optionPlaceHolderStyle2,
                }
            ]
        },
        {
            name: '党员积分情况',
            type: 'pie',
            clockWise: false,
            hoverAnimation: false,

            radius: [71, 83],
            center: ['50%', '68%'],
            itemStyle: optionDataStyle2,
            data: [
                {
                    value: 0,
                    name: '80分至90分的人数占比的'
                },
                {
                    value: 100,
                    name: 'invisible',
                    itemStyle: optionPlaceHolderStyle2
                }
            ]
        },
        {
            name: '党员积分情况',
            type: 'pie',
            clockWise: false,
            hoverAnimation: false,

            radius: [59, 71],
            center: ['50%', '68%'],
            itemStyle: optionDataStyle2,
            data: [
                {
                    value: 0,
                    name: '70分至80分的人数占比的'
                },
                {
                    value: 100,
                    name: 'invisible',
                    itemStyle: optionPlaceHolderStyle2
                }
            ]
        },
        {
            name: '党员积分情况',
            type: 'pie',
            clockWise: false,
            hoverAnimation: false,

            radius: [47, 59],
            center: ['50%', '68%'],
            itemStyle: optionDataStyle2,
            data: [
                {
                    value: 0,
                    name: '60分至70分的人数占比的'
                },
                {
                    value: 100,
                    name: 'invisible',
                    itemStyle: optionPlaceHolderStyle2
                }
            ]
        }
    ]
};

/**
 * 党建学习情况统计
 */
export let option3 = {
    tooltip: {
        show: false,
        // trigger: 'axis',
        // axisPointer : {            // 坐标轴指示器，坐标轴触发有效
        //     type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        // },
        // formatter: function (params, ticket, callback) {
        //     console.log(params,ticket,callback)
        //     var res = params[0].name ;
        //     for (var i = 0, l = params.length; i < l; i++) {
        //         res += '<br/>' + params[i].seriesName + ' : ' + Math.abs(params[i].value) ;     
        //         }
        //     setTimeout(function () {
        //         // 仅为了模拟异步回调
        //     callback(ticket, res);
        //     }, 0)
        //     return ' ';
        // }
    },
    color: ["#559faa", "#e83d35"],
    legend: {
        data: ['两学一做', '三会一课'],
        textStyle: {
            color: "#fff"
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: [
        {
            type: 'value',
            splitLine: { show: false },
            axisLabel: {
                color: "#3c3c43"
            },
            axisLine: {
                // show: false,
                lineStyle: {
                    color: "#3c3c43"
                }
            },
            axisLabel: {
                color: "#fff",
                formatter: function (value) { return Math.abs(value) }
            },

        }

    ],
    yAxis: [
        {
            type: 'category',
            axisTick: { show: false },
            data: [
                "肥乡镇",
                "天台山镇",
                "辛安镇镇",
                "大寺上镇",
                "东漳堡镇",
                "毛演堡镇",
                "元固乡镇",
                "屯庄营镇",
                "旧店乡镇"
            ],
            axisLine: {
                // show: true,
                lineStyle: {
                    color: "#3c3c43"
                }
            },

            // splitLine: { show: false },
            axisLabel: {
                color: "#fff"
            }
        }
    ],
    series: [
        {
            name: '三会一课',
            type: 'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    position: "inside",
                    color: "#fff"
                }
            },
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0]
        },
        {
            name: '两学一做',
            type: 'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    position: "inside",
                    color: "#fff",
                    formatter: function (v) { return Math.abs(v.data) }
                }
            },
            data: [-0, -0, -0, -0, -0, -0, -0, -0, -0,]
        },
    ]
};
/**
 * 取号TOP3
 */
export let option5 = {
    xAxis: [{
        show: false,
    },
    //由于下边X轴已经是百分比刻度了,所以需要在顶部加一个X轴,刻度是金额,也隐藏掉
    {
        show: false,
    }
    ],
    grid: {
        left: '3%',
        // right: '4%',
        top: "0",
        bottom: "3%",
        // containLabel: true
    },
    yAxis: {
        type: 'category',
        axisLabel: {
            show: false, //让Y轴数据不显示
        },
        axisTick: {
            show: false, //隐藏Y轴刻度
        },
        axisLine: {
            show: false, //隐藏Y轴线段
        },
        // data: xingm,
    },
    series: [
        {
            show: true,
            type: 'bar',
            barGap: '-100%',
            barCategoryGap: "60%",
            itemStyle: {
                normal: {
                    color: '#002b76',
                    barBorderRadius: 50,
                    borderWidth: 0,
                },

            },
            data: [0, 0, 0],
            label: {
                normal: {
                    show: true,
                    textStyle: {
                        color: '#fffc00', //百分比颜色
                    },
                    position: 'right',
                }
            },

        },
        {
            show: true,
            type: 'bar',
            barGap: '-100%',
            // barCateGoryGap:"20px",

            itemStyle: {
                normal: {
                    barBorderRadius: 50,
                    borderWidth: 0,
                    color: {
                        type: 'bar',
                        colorStops: [{
                            offset: 0,
                            color: '#4795ff' // 0% 处的颜色
                        }, {
                            offset: 1,
                            color: '#00d8e6' // 100% 处的颜色
                        }],
                        globalCoord: false, // 缺省为 false

                    }
                },
            },
            label: {
                normal: {
                    show: true,
                    textStyle: {
                        color: '#fff', //百分比颜色
                    },
                    position: 'inside',
                }
            },
            labelLine: {
                show: false,
            },
            data: [0, 0, 0],
        }
    ]
};

/**
 * 事件类型统计
 */

export let option6 = (value, maxValue = 1000) => {
    let percent = value / maxValue;
    let option = {
        grid: {
            // left: "0%",
            // right: "10%",
            // bottom: "3%",
            containLabel: true
        },
        tooltip: {
            show: false,
            trigger: 'item',
            formatter: function (res) {
                return res.seriesName + ': ' + (res.value * 10000 / 100).toFixed(2) + '%';
            }
        },
        series: [{
            type: 'liquidFill',
            radius: '98%',
            itemStyle: {
                normal: {
                    // opacity: 0.4,
                    shadowBlur: 0,
                    shadowColor: 'blue'
                }
            },
            name: "今日完成进度",
            data: [{
                value: percent,
                itemStyle: {
                    normal: {
                        color: '#00adac',
                        opacity: 1
                    }
                }
            }],
            // background: '#fff',
            color: ['#009595'],
            center: ['50%', '50%'],
            backgroundStyle: {
                color: 'transparent'
            },
            label: {
                normal: {
                    formatter: '',
                    textStyle: {
                        fontSize: 12
                    }
                }
            },
            outline: {
                itemStyle: {
                    borderColor: '#fff',
                    borderWidth: 0
                },
                borderDistance: 0
            }
        }
        ]
    }
    return option;
}
/**
 * 各来源占比
 */
export let option7 = {
    grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
    },
    tooltip: {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    color: ["#c3e7ff", "#5298cc", "#7fc5ee"],
    // legend: {
    //     x : 'center',
    //     y : 'bottom',
    //     data:['上级交办','电话','公众号']
    // },
    // toolbox: {
    //     show : true,
    //     feature : {
    //         mark : {show: true},
    //         dataView : {show: true, readOnly: false},
    //         magicType : {
    //             show: true,
    //             type: ['pie', 'funnel']
    //         },
    //         restore : {show: true},
    //         saveAsImage : {show: true}
    //     }
    // },
    // calculable : true,
    series: [
        {
            name: '各来源占比',
            type: 'pie',
            hoverAnimation: false,
            radius: [10, 35],
            center: ['50%', '50%'],
            roseType: 'radius',
            label: {
                normal: {
                    show: false
                },
                // emphasis: {
                //     show: true
                // }
            },
            lableLine: {
                normal: {
                    show: false
                },
                // emphasis: {
                //     show: true
                // }
            },
            data: [
                { value: 0, name: '上级交办' },
                { value: 0, name: '电话' },
                { value: 0, name: '公众号' },
            ]
        }
    ]
};
/**
 * 各部门办理情况对比分析
 */

export let option8 = {
    grid: {
        left: "1%",
        right: "1%",
        bottom: "1%",
        containLabel: true
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            crossStyle: {
                color: '#999'
            }
        }
    },
    color: ["#3efee3", "#f33044", "#82eefe"],
    legend: {
        top: 25,
        textStyle: {
            color: "#fff"
        },
        data: ['受理', '办结', '平均办结']
    },
    xAxis: [
        {
            type: 'category',
            data: ['教育局', '公安局', '民政局', '司法局', '人社局', '建设局', '房管局', '水利局', '市场监督管理局', '生态环监局', '体育局'],
            axisPointer: {
                type: 'shadow'
            },
            splitLine: { show: false },
            axisLabel: {
                rotate: 45,
                color: "#fff"
            },
        }
    ],
    yAxis: [
        {
            type: 'value',
            // name: '受理',
            splitLine: { show: false },
            axisLabel: {
                color: "#fff",
                formatter: '{value} '
            }
        },
        {
            type: 'value',
            // name: '平均办结',
            splitLine: { show: false },
            axisTick: {
                show: false, //隐藏Y轴刻度
            },
            axisLine: { show: false },
            axisLabel: {
                show: false,
                color: "#fff",
                formatter: '{value} %'
            }
        }
    ],
    series: [
        {
            name: '受理',
            type: 'bar',
            label: {
                normal: {
                    // show: true,
                    textStyle: {
                        color: '#fff', //百分比颜色
                    },
                    position: 'top',
                }
            },
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
        },
        {
            name: '办结',
            type: 'bar',
            label: {
                normal: {
                    // show: true,
                    textStyle: {
                        color: '#fff', //百分比颜色
                    },
                    position: 'top',
                }
            },
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
        },
        {
            name: '平均办结',
            type: 'line',
            yAxisIndex: 1,
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
        }
    ]
};
/**
 * 热词分析
 */

export let option9 = {
    grid: {
        left: "1%",
        right: "1%",
        bottom: "1%",
        containLabel: true
    },
    series: [{
        type: "wordCloud",
        gridSize: 20,
        sizeRange: [10, 16],
        rotationRange: [1, 1],
        shape: 'circle',
        drawOutOfBound: true,
        textStyle: {
            normal: {
                color: function () {
                    let color = ["#e83c34", "#539eaa", "#eea17d", "#84cfb6", "#f06807", "#fff000"]
                    let num = Math.floor(Math.random() * (6 + 1));
                    return color[num];
                }
            },
            emphasis: {
                shadowBlur: 10,
                shadowColor: '#333'
            }
        },
        data: [
            { name: "社保办理", value: 10 },
            { name: "公积金提取", value: 15 },
            { name: "积分入户", value: 13 },
            { name: "人才", value: 15 },
            { name: "买车", value: 13 },
            { name: "公积金贷款", value: 16 },
            { name: "落户", value: 11 },
            { name: "物价", value: 11 },
            { name: "教育问题", value: 12 },
            { name: "工作机会", value: 11 },
            { name: "海南", value: 12 },
            { name: "生活水平", value: 12 },
            { name: "就业", value: 11 },
            { name: "修路", value: 12 },
            { name: "商贷", value: 11 },
            { name: "买房", value: 11 },
            { name: "安全", value: 12 },
            { name: "养老", value: 11 },
            { name: "教育问题", value: 15 },
        ]
    }]
}

export let option10 = {
    tooltip: {
        trigger: 'axis',
        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        data: ['一般', '重大', '阶段性'],
        textStyle: {
            color: "#fff"
        },
    },
    color: ["#59a2d3", "#8adde0", "#f8da78", "#f0a388"],
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'value',
        splitLine: { show: false },
        axisLabel: {
            // rotate: 45,
            color: "#fff"
        },
        axisLine: {
            show: false,
            lineStyle: {
                // color:"#fff"
            }
        },
    },
    yAxis: {
        type: 'category',
        splitLine: { show: false },
        axisLabel: {
            color: "#fff"
        },
        axisLine: {
            show: false,
            lineStyle: {
                // color:"#fff"
            }
        },
        data: ["其他事件类", "突发事件类", "宣传广告类", "施工管理类", "街面秩序类", "市容环境类"]
    },
    series: [
        {
            name: '一般',
            type: 'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    position: 'insideRight'
                }
            },
            data: []
        },
        {
            name: '重大',
            type: 'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    position: 'insideRight'
                }
            },
            data: []
        },
        {
            name: '阶段性',
            type: 'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    position: 'insideRight'
                }
            },
            data: []
        },
    ]
};

export let option11 = {
    tooltip: {
        trigger: 'axis'
    },
    calculable: true,
    color: ["#00aead"],
    polar: [
        {
            indicator: [
                { text: '肥乡镇', max: 1 },
                { text: '天台山镇', max: 1 },
                { text: '辛安镇镇', max: 1 },
                { text: '大寺上镇', max: 1 },
                { text: '东漳堡乡', max: 1 },
                { text: '毛演堡镇', max: 1 },
                { text: '元固乡', max: 1 },
                { text: '西吕营镇', max: 1 },
                { text: '旧店乡', max: 1 },
            ],
            radius: 46,
            splitArea: {
                show: true,
                areaStyle: {
                    color: ["transparent", "#154169"]  // 图表背景网格的颜色
                }

            },
            splitLine: {
                show: true,
                lineStyle: {
                    width: 1,
                    color: ['#2d4e79', '#2d4e79'] // 图表背景网格线的颜色
                }

            },
            axisLine: {            // 坐标轴线

                show: true,        // 默认显示，属性show控制显示与否
                lineStyle: {
                    color: '#027089'
                }
            },
            name: {
                formatter: '{value}',
                color: '#abd8eb'
            },
        },
    ],
    series: [
        {
            name: '城管事件分布',
            type: 'radar',
            itemStyle: {
                normal: {
                    areaStyle: {
                        type: 'default',
                    },
                },
            },
            label: {
                normal: {
                    color: "#fff"
                }
            },
            data: [
                {
                    value: [0, 0, 0, 0, 0, 0, 0, 0, 0],
                    name: '城管事件分布'
                },
            ]
        }
    ]
};



export let mapOption = (seriData = []) => {

    /**
     * 地图
     */
    var geoCoordMap = {
        大寺上镇: [114.65843, 36.513428],
        天台山镇: [114.736835, 36.516126],
        辛安镇镇: [114.735828, 36.589533],
        肥乡镇: [114.803094, 36.571999],
        毛演堡镇: [114.792817, 36.63875],
        旧店乡: [114.936833, 36.601094],
        东漳堡镇: [114.98149060100, 36.58933174350],
        西吕营镇: [114.919586, 36.554723],
        元固乡: [114.836187, 36.532454]
    };
    var data = seriData.length?seriData:[
        { name: "大寺上镇", total: 0 },
        { name: "天台山镇", total: 0 },
        { name: "辛安镇镇", total: 0 },
        { name: "肥乡镇", total: 0 },
        { name: "毛演堡镇", total: 0 },
        { name: "旧店乡", total: 0 },
        { name: "东漳堡镇", total: 0 },
        { name: "西吕营镇", total: 0 },
        { name: "元固乡", total: 0 },
    ];
    var convertData = function (data) {
        var res = [];
        for (var i = 0; i < data.length; i++) {
            var geoCoord = geoCoordMap[data[i].name]; //首先根据data中的name作为键值读入地理坐标
            //var rjj1 = data[i].value;
            if (geoCoord) {
                res.push({
                    name: data[i].name,
                    value: geoCoord.concat(data[i].total) //随后将地理坐标与对应信息值衔接起来
                    //成为了 [name 经度 纬度 value]的形式
                });
            }
        }
        return res;
    };
    let option = {
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            top: 0,
            containLabel: true
        },
        geo: [
            {
                // name: "肥乡区",
                // type: "map",
                left: 20,
                right: 20,
                bottom: 20,
                top: 20,
                map: "ff", // 自定义扩展图表类型
                label: {
                    show: true,
                    color: "#00f6ff"
                },
                itemStyle: {
                    normal: {
                        label: {
                            show: true, //默认是否显示省份名称
                            color: "#fff"
                        },
                        shadowColor: "#00336e",
                        // shadowOffsetX: 10,
                        shadowOffsetY: 30,
                        shadowBlur: 20,
                        areaColor: "#121d44",
                        borderWidth: 1,
                        borderColor: "#19339f"
                    },

                },
            },
            {
                // name: "肥乡区",
                // type: "map",
                left: 20,
                right: 20,
                bottom: 20,
                top: 20,
                map: "ff", // 自定义扩展图表类型
                label: {
                    show: true,
                    color: "#00f6ff"
                },
                itemStyle: {
                    normal: {
                        label: {
                            show: true, //默认是否显示省份名称
                            color: "#fff"
                        },
                        areaColor: "#121d44",
                        borderWidth: 1,
                        borderColor: "#19339f",
                    },

                },
                emphasis: {
                    label: {
                        show: true, //选中状态是否显示省份名称
                        color: "#00f6ff",
                    },
                    itemStyle: {
                        areaColor: "#1e3482"
                    }
                }
            }
        ],
        series: [
            {
                type: "effectScatter",
                coordinateSystem: "geo",
                showEffectOn: "render",
                symbolSize: function (val) {
                    return val[2] / 10;
                },
                rippleEffect: {
                    period: 15,
                    // scale: 4,
                    brushType: "stroke"
                },
                hoverAnimation: true,
                itemStyle: {
                    normal: {
                        color: "#f4e925",
                        shadowBlur: 10,
                        shadowColor: "#333"
                    }
                },
                data: convertData(data)
            },

        ]
    }
    return option;
}